<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Runner, About Us</title>
<meta name="keywords" content="runner, about us, free template, CSS, HTML" />
<meta name="description" content="Runner, About Us, Multiple Columns, free website template by templatemo.com" />
<link href="templatemo_style.css" rel="stylesheet" type="text/css" />

<link rel="stylesheet" href="css/orman.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/nivo-slider.css" type="text/css" media="screen" />	

<link rel="stylesheet" type="text/css" href="css/ddsmoothmenu.css" />

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/ddsmoothmenu.js">

/***********************************************
* Smooth Navigational Menu- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>

<script type="text/javascript">

ddsmoothmenu.init({
	mainmenuid: "templatemo_menu", //menu DIV id
	orientation: 'h', //Horizontal or vertical menu: Set to "h" or "v"
	classname: 'ddsmoothmenu', //class added to menu's outer DIV
	//customtheme: ["#1c5a80", "#18374a"],
	contentsource: "markup" //"markup" or ["container_id", "path_to_menu_file"]
})

</script>

<link rel="stylesheet" href="css/slimbox2.css" type="text/css" media="screen" /> 
<script type="text/JavaScript" src="js/slimbox2.js"></script> 

</head>
<body id="subpage">

<div id="templatemo_wrapper">
	<div id="templatemo_header">
    	<div id="site_title"><a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a></div>
        <div id="templatemo_menu" class="ddsmoothmenu">
            <ul>
                <li><a href="index.html">Home</a></li>
                <li><a href="about.html" class="selected">About</a>
                    <ul>
                        <li><a href="#">Sub Page One</a></li>
                        <li><a href="#">Sub Page Two</a></li>
                        <li><a href="#">Sub Page Three</a></li>
                  </ul>
                </li>
                <li><a href="portfolio.html">Gallery</a>
                    <ul>
                        <li><a href="#">Page Link One</a></li>
                        <li><a href="#">Link Two</a></li>
                        <li><a href="#">Page Link Three</a></li>
                        <li><a href="#">Link Four</a></li>
                        <li><a href="#">Page Link Five</a></li>
                  </ul>
                </li>
                <li><a href="blog.html">Blog</a></li>
                <li><a href="contact.html">Contact</a></li>
            </ul>
            <br style="clear: left" />
        </div> <!-- end of templatemo_menu -->
    </div> <!-- END of header -->
    
    <div id="templatemo_page_intro">
    	<h1>About</h1>
        <p>Curabitur facilisis urna libero, in tempor arcu eleifend eu. Donec in risus in odio feugiat fringilla at id lacus. Praesent a massa placerat, varius ligula sit amet, fermentum metus.</p>
    </div>
    
    <div id="templatemo_twitter">
    	Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur eu nulla vel lorem volutpat tincidunt. Cras congue risus id nibh.
    </div> <!-- END of twitter -->
    
    <div id="templatemo_main">
    	<div id="templatemo_content" class="left">
            <h2>Donec Non Lectus Urna</h2>
          <div class="col col_2">
            <h5>Ut Non Nibh</h5>
            Ut non nibh vel leo dapibus gravida et at dolor. Nullam non turpis eros, non euismod velit. Quisque tristique turpis eu sapien pharetra nec varius urna eleifend. Cras eu elit hendrerit eros iaculis molestie. Aliquam erat volutpat. Validate <a href="#" ><strong>XHTML</strong></a> &amp; <a href="#" ><strong>CSS</strong></a>.</div>
            <div class="col col_2 no_mr">
                <h5>Mauris Quis Elit</h5>
                Mauris quis elit nec ante vulputate pellentesque. Suspendisse non arcu tortor, a vulputate augue. Donec nec odio ante, ac pharetra mauris. Duis feugiat elementum mi. Aenean pharetra sapien, sit amet vehicula nunc ultrices eget. 
            </div>
            <div class="clear"></div>
            <div class="col col_3">
                <h5>Nunc Luctus Vehicula</h5>
                Nunc luctus vehicula sapien ut ultrices. Sed aliquet tincidunt lorem, imperdiet fringilla felis facilisis sed. Integer libero arcu, rhoncus in facilisis vel, sollicitudin aliquet nisi. Donec non lectus urna, sed ornare magna quam molestie.
            </div>
            <div class="col col_3">
                <h5> Nunc Luctus Vehicula</h5>
                Nunc luctus vehicula sapien ut ultrices. Sed aliquet tincidunt lorem, imperdiet fringilla felis facilisis sed. Integer libero arcu, rhoncus in facilisis vel, sollicitudin aliquet nisi. Donec non lectus urna, sed ornare magna quam molestie.
            </div>
            <div class="col col_3 no_mr">
                <h5>Nullam Justo Nisl</h5>
                Nullam justo nisl, feugiat non tempor a, luctus imperdiet magna. Donec rhoncus, neque quis dapibus dapibus, lorem tortor semper est, sit amet auctor metus neque ut nisl. Pellentesque elementum posuere mauris vitae dictum.
            </div>
            <div class="clear"></div>
			
            <div class="col col_3">
                <h5>Nunc Luctus</h5>
                Nunc luctus vehicula sapien ut ultrices. Sed aliquet tincidunt lorem, imperdiet fringilla felis facilisis sed. Integer libero arcu, rhoncus in facilisis vel, sollicitudin aliquet nisi. Donec non lectus urna, sed ornare magna quam molestie.
            </div>
            <div class="col col_32 no_mr">
                <h5>Ut Non Nibh</h5>
                Ut non nibh vel leo dapibus gravida et at dolor. Nullam non turpis eros, non euismod velit. Quisque tristique turpis eu sapien pharetra nec varius urna eleifend. Cras eu elit hendrerit eros iaculis molestie. Aliquam erat volutpat. Duis est felis, aliquam ac convallis dictum, luctus a urna. Fusce nec mi a massa faucibus egestas eu sed sapien. Etiam id ultricies turpis. Phasellus lorem erat, posuere sed mattis id, lacinia id ipsum. Suspendisse dui orci, suscipit quis varius vel, laoreet quis erat. Cras sit amet erat lectus.
			</div>
            <div class="clear"></div>
            <div class="col col_32">
                <h5>Nullam Non Turpis</h5>
                Ut non nibh vel leo dapibus gravida et at dolor. Nullam non turpis eros, non euismod velit. Quisque tristique turpis eu sapien pharetra nec varius urna eleifend. Cras eu elit hendrerit eros iaculis molestie. Aliquam erat volutpat. Duis est felis, aliquam ac convallis dictum, luctus a urna. Fusce nec mi a massa faucibus egestas eu sed sapien. Etiam id ultricies turpis. Phasellus lorem erat, posuere sed mattis id, lacinia id ipsum. Suspendisse dui orci, suscipit quis varius vel, laoreet quis erat. Cras sit amet erat lectus.
			</div>
			<div class="col col_3 no_mr">
                <h5>Sed Aliquet</h5>
                Nunc luctus vehicula sapien ut ultrices. Sed aliquet tincidunt lorem, imperdiet fringilla felis facilisis sed. Integer libero arcu, rhoncus in facilisis vel, sollicitudin aliquet nisi. Donec non lectus urna, sed ornare magna quam molestie.
            </div>
        </div> <!-- END of content -->
                
		<div id="templatemo_sidebar" class="right">
			
			<div class="sidebar_section">
                <h2>Services</h2>
                <img src="images/templatemo_image_01.jpg" alt="image" class="img_nom img_border" />
                <p><em>Ut non nibh vel leo dapibus gravida et at dolor. Nullam non turpis eros, non euismod velit. </em></p>
                <ul class="list_bullet">
                    <li><a href="#">Cras eu elit hendrerit</a></li>
                    <li><a href="#">Aliquam erat volutpat</a></li>
                    <li><a href="#">Duis est felis</a></li>
                    <li><a href="#">Etiam id ultricies</a></li>
                    <li><a href="#">Phasellus lorem erat</a></li>
                </ul>
                <a href="#" class="more">More</a>
			</div>
            <div class="testimonial">
            	<p class="testimonial_text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam turpis enim, feugiat nec euismod et, mattis a ipsum. Aliquam erat volutpat. </p>
                <p><strong>John</strong> - <a href="#">templatemo.com</a></p>
            </div>
      </div>
        
        <div class="clear"></div>
                
    </div> <!-- END of main -->
</div> <!-- END of wrapper -->

<div id="templatemo_bottom_wrapper">
	<div id="templatemo_bottom">
    	
        <div class="col col_3">
            <h4>Photo Gallery</h4>
            <ul class="nobullet footer_gallery">
                <li><a href="images/portfolio/02.jpg" rel="lightbox[gallery]"><img src="images/templatemo_image_02.png" alt="image 2" /></a></li>
                <li><a href="images/portfolio/03.jpg" rel="lightbox[gallery]"><img src="images/templatemo_image_03.png" alt="image 3" /></a></li>
                <li><a href="images/portfolio/04.jpg" rel="lightbox[gallery]"><img src="images/templatemo_image_04.png" alt="image 4" /></a></li>
                <li><a href="images/portfolio/05.jpg" rel="lightbox[gallery]"><img src="images/templatemo_image_05.png" alt="image 5" /></a></li>
                <li><a href="images/portfolio/03.jpg" rel="lightbox[gallery]"><img src="images/templatemo_image_06.png" alt="image 6" /></a></li>
                <li><a href="images/portfolio/01.jpg" rel="lightbox[gallery]"><img src="images/templatemo_image_07.png" alt="image 7" /></a></li>
            </ul>
            <div class="clear"></div>
            <a href="portfolio.html" class="more">View all</a>
        </div>
    	
        <div class="col col_3">
        	<h4>Twitter</h4>
      		<ul class="nobullet twitter">
                <li><a href="#">@网站模板</a> Proin turpis nisi, placerat quis orci ac, tempor iaculis eros.</li>
                <li>Suspendisse enean <a href="#">#FREE</a> website template, mi lacus gravida nisi, vitae commodo orci nisi non nulla.</li>
                <li>Sed non varius lorem, in sollicitudin lectus. Cras vel urna a urna gravida consequat. Curabitur non risus dui. <a  href="#">#</a></li>
                <li><a href="#" title="visit cn.mystockphoto.com" class="rower"  target="_blank">visit cn.mystockphoto.com</a></li>
            </ul>
        </div>
        
        <div class="col col_3 no_mr">
        	<h4>Follow Us</h4>
            <ul class="nobullet social">
            	<li><a  href="#/templatemo" class="facebook">Facebook</a></li>
                <li><a href="#" class="twitter">Twitter</a></li>
                <li><a href="#" class="youtube">Youtube</a></li>
                <li><a href="#" class="google">Google+</a></li>
                <li><a href="#" class="vimeo">Vimeo</a></li>
                <li><a href="#" class="skype">Skype</a></li>
            </ul>
        </div>
        
        <div class="clear"></div>
    </div> <!-- END of bottom -->
    
</div> <!-- END of bottom wrapper -->

<div id="templatemo_footer_wrapper">
	<div id="templatemo_footer">
    	Copyright © 2084 Company Name | More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a> | Collect from <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a>
    </div> <!-- END of footer -->
</div> <!-- END of footer wrapper -->

</body>
<script type='text/javascript' src='js/logging.js'></script>
</html>